import Nav from "../components/nav";
import { searchNavs } from "../assets/js/nav.config";
import ListView from "./ListView";
import { Pagination } from "antd";
import { useHistory, useLocation } from "react-router";
import qs from "qs";
import { useGuards } from "../components/withGuards";

export default () => {
    useGuards();
    const { search } = useLocation();
    const { tab = "all", page = "1" } = qs.parse(search.substr(1));
    const { push } = useHistory();
    return (
        <div className="inner">
            <Nav
                data={searchNavs}
                isdark={false}
                getSelectKey={({ search }) => {
                    return searchNavs.findIndex((item) => {
                        return item.path == search;
                    });
                }}
            />

            <ListView />
            <Pagination
                total={500}
                pageSize={10}
                current={Number(page)}
                showSizeChanger={false}
                onChange={(page) => {
                    push(`/?tab=${tab}&page=${page}`);
                }}
            />
        </div>
    );
};
